<style lang="less" scoped>
	.supportWarp{
		background: #F6FAF9;
		.logo{
			width: 100%;
			height: 4.91rem;			
			padding: 1.68rem 0 0 1.97rem;
			img{
				width: 6.03rem;
				height: 2.13rem;
			}
		}
		.div{
			width: 9.6rem;			
			margin-left:0.2rem;			
			.title{
				height: 1.95rem;
				background: url('../../images/phone-support-title.png') no-repeat;
				background-size: 100% 100%;
				padding-top: 0.53rem;
				border-bottom: 0.02rem solid #E3E8EA;
				div{
					height: 1.41rem;
					display: flex;
					align-items: center;
					span{
						display: inline-block;
						width: 0.13rem;
						height: 0.53rem;
						border-radius: 1.33rem;
						background-image: linear-gradient(-145deg, #FFAC12 0%, #FD5286 100%);
						margin: 0 0.27rem 0 0.32rem;						
					}
					p{
						color: #FE9333;
						font-size: 0.43rem;
						font-weight: bold;
					}
				}
			}
			.content{
				background: #fff;
				padding: 0.64rem 0.32rem 0.53rem 0.32rem;
				p{
					font-size: 0.43rem;
					color: #2C2C2C;
					line-height: 0.8rem;
					text-align: justify;
					text-indent: 0.8rem;
				}
			}
		}
		.div2{
			width: 9.6rem;			
			margin-left:0.2rem;	
			background: #fff;
			.title{
				height: 1.41rem;
				background-image: linear-gradient(-1deg, #F6FAF9 0%, #E3E8EA 100%);
				border-bottom: 0.02rem solid #E3E8EA;
				border-radius: 0.11rem 0.11rem 0 0  ;
				display: flex;
				align-items: center;
				span{
					display: inline-block;
					width: 0.13rem;
					height: 0.53rem;
					border-radius: 1.33rem;
					background-image: linear-gradient(-150deg, #F58D5F 0%, #E50012 100%);
					margin: 0 0.27rem 0 0.32rem;						
				}
				p{
					color: #E95513;
					font-size: 0.43rem;
					font-weight: bold;
				}
			}
			.content{
				text-align: center;
				.p{
					text-align: center;
					margin-top: 0.8rem;
					.line{
						display: inline-block;
						width: 0.64rem;
						height: 0.03rem;
						background: #CDD3D6;
						vertical-align: super;
					}
					.txt{
						img{
							width: 0.59rem;
							height: 0.59rem;
							vertical-align: sub;
							margin-right: 0.24rem;
						}
						font-size: 0.48rem;
						line-height: 0.67rem;
						margin: 0 0.4rem 0 0.45rem;
						color: #23C253;
					}
				}
				.ewm{
					width: 5.6rem;
					height: 5.6rem;
					margin: 0.37rem 0 0.53rem 0 ;
					box-shadow: 2px 4px 16px 0 rgba(230,234,236,1);
				}
				.p2{
					font-size: 0.37rem;
					line-height: 0.59rem;
					color: #686E71;
					display: flex;
					justify-content: center;
					text-align: justify;
					padding-bottom: 1.15rem;
					img{
						margin: 0.08rem 0.27rem 0 0 ;
						width: 1.01rem;
						height: 1.01rem;
					}
				}
			}
		}
		.div3{
			width: 9.6rem;			
			margin-left:0.2rem;	
			background: #fff;
			.title{
				height: 1.41rem;
				line-height: 1.41rem;
				background-image: linear-gradient(-1deg, #F6FAF9 0%, #E3E8EA 100%);
				font-size: 0.43rem;
				font-weight: bold;
				color: #686E71;
				text-align: center;
			}
			.content{
				padding: 0.53rem 0 0.32rem 0.8rem;
				font-size: 0.43rem;
				color: #FF7900;
				font-weight: bold;
				p{
					margin-bottom: 0.32rem;
				}
				img{
					width: 0.64rem;
					height: 0.64rem;
					margin-right: 0.53rem;
					vertical-align: sub;
				}
			}
		}

	}
</style>

<template>	
<div class="supportWarp">
	<div class="logo"><img src="../../images/phone-logo.png" alt=""></div>
	<div class="div">
		<div class="title">
			<div>
				<span></span>
				<p>星星网殡葬互联网智能系统</p>
			</div>
		</div>
		<div class="content">
			<p>星星网平台（www.lifebook.xin）利用绿色殡葬铜制品加以二维码集合，以信息技术改造殡葬行业，通过连接陵园、客户、数据、第三方服务及供应链，提供一套完整的智慧殡葬解决方案，包括陵园管理系统、景观设计、电商平台等。</p>
			<p>
				通过一站式整合殡葬行业信息资源、软件服务支持及人文科技相结合，提高用户与殡葬企业的粘性，将传统的殡葬企业与客户的“弱联系”转换为 “强联系”；减少企业人员及技术支持成本；通过精准地数据分析，为企业提供预测性的商业策划未来发展策略；打造企业品牌；利用电商协助殡葬行业更好的开拓后服务市场，实现更多创收。
			</p>
			<p>星星网公司是全球第一家系统性提出陵园后服务市场慨念的领导者，绿色殡葬科技殡葬实践者，陵园信息化专家！</p>			
		</div>
	</div>
	<div class="div2">
		<div class="title">
			<span></span>
			<p>上海万豪实业有限公司</p>
		</div>
		<div class="content">
			<p class="p">
				<span class="line"></span>
				<span class="txt"><img src="../../images/phone-support-wx.png" alt="">万豪微信公众号</span>
				<span class="line"></span>				
			</p>
			<img class="ewm" src="../../images/phone-support-ewm.png" alt="">
			<p class="p2">
				<img src="../../images/phone-support-push.png" alt="">
				<span>长按识别万豪微信公众号 <br /> 了解更多资讯</span>
			</p>
		</div>
	</div>
	<div class="div3">
		<div class="title">联系我们</div>
		<div class="content">
			<p><img src="../../images/phone-support-num.png" alt="">400-056-9906</p>
			<p><img src="../../images/phone-support-address.png" alt="">上海市闵行区景联路398号</p>
		</div>
	</div>
</div>
</template>
<script>
    import { mapState } from 'vuex'
    import global from '../../config/global'
    import '../../js/flexible.debug.js'
    import '../../less/moblie.less'
    export default {
		data() {
			return {
			}
		},
		mounted(){
			
		},
		components: {
		},
		computed: {
		},
		mounted(){
			document.body.scrollTop = 0;
            document.documentElement.scrollTop = 0;
		},
		created() {
		},
		watch: {
			// 如果路由有变化，会再次执行该方法
		},
        computed: mapState({ user: state => state.user }),
		methods:{
		},
		
    }
</script>